<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <style>
        
        img {
            width: 700px;
            height: 700px;
            margin: auto;
            text-align: center;

        }
        iframe {width: 1000px;
            height: 500px;
            margin: auto;
            text-align: center;
}
div{top: 500px;}

        ul {
            list-style-type: none;
            margin: 0;
            padding: 0;
            overflow: hidden;
            background-color: #333;



        }

        li {
            float: left;
        }

        li a {
            display: block;
            color: white;
            text-align: center;
            padding: 14px 16px;
            text-decoration: none;
            margin: auto;
            width: 220px;

        }

        li a:hover {
            background-color: #111;
        }

        P {
            color: black;
            text-align: center;
            font-size: 30px;
        }


        .z {
            color: cadetblue;
            font-size: 40px;
        }

        h1 {
            color: cadetblue;
            font-size: 40px;
        }
        h2 {
            color: lightpink;
            font-size: 40px;
        }
        h3 {
            color: darksalmon;
            font-size: 40px;
        }
        h4 {
            color: darksalmon;
            font-size: 40px;
        }

    </style>
</head>

<body  style="text-align: center;">

    <header>


        <ul>
            <li><a href="index.html"> 首页介绍</a></li>

            <li><a href="wf.html">游戏玩法</a></li>
            <li><a href="js.html">游戏角色</a></li>
            <li><a href="fg.html">各地风光</a></li>
            <li><a href="bg.html">报告</a></li>
            <li><a href="gr.html">个人中心</a></li>

        </ul>
    <main>
        <h1>人员信息</h1>
<p>课程名称：web基础</p>
<p>主题：游戏介绍</p>
<p>作者：黄亚楠 软件工程2213班 0223694</p>
<h2>网站介绍</h2>
<P>网站主题：原神</P>
<h3>网站结构</h3>
<p>网站由一个主页与七个子网页构成每个网站之间都能相互跳转</p>
<h4>首页</h4>
<P>水平导航栏：运用浮动（float,clear）</P>
<p><img src="bg1.jpg"></p>
<P>侧边栏:使用了无序列表</P>
<p><img src="bg2.jpg"></p>
<p>风景：使用了table,position,img.</p>
<p><img src="bg3.jpg"></p>
<p>人物介绍；使用了表格table，ifrume插入视频。</p>
<p><img src="bg4.jpg"></p>
<p>设置链接返回首页</p>
<p><img src="bg5.jpg"></p>
<p>登录，动图</p>
<p><img src="bg6.jpg"></p>
<h5>总结</h5>
<p>网站的风格还有待进一步的完善.技术不成熟。通过实操进一步了解知识点，并了解一些新的知识点（@akeyframes）</p>





</main>
    <footer>
        <p><a href="index.html">返回首页</a></p>
   
    </footer>